<template>
	<view class="page">
		<view class="list" v-for="(item, index) in items" :key="item.id">
			<view class="name" @click="chooseAddress(item)">收货人：{{item.name}} <text class="fr">{{item.mobile}}</text></view>
			<view class="detail_address" @click="chooseAddress(item)">
				{{item.address}}{{item.detailed_address}}
			</view>
			<view class="bottom">
				<label class="uni-list-cell uni-list-cell-pd">
					<checkbox :value="item.value" :checked="item.is_default == 1" color="#22BF8A" style="transform:scale(0.7)" />
					<text :class="{text_green:item.is_default == 1}">默认地址</text>
				</label>
				<view class="btn_box">
					<view @click="editAdress(item)">
						<image src="../../static/edit.png" mode="heightFix"></image> 编辑
					</view>
					<view @click="deleteAddress(item)">
						<image src="../../static/delete.png" mode="heightFix"></image> 删除
					</view>
				</view>
			</view>
		</view>

		<view class="submit_btn" @click="goAdd">
			新增地址
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				items: [],
				selectValue: "",
				isChoose:false
			}
		},
		methods: {
			radioChange: function(evt) {
				this.selectValue = evt.target.value
			},
			getList() {
				this.$get('address/addresslist', {}, (res) => {
					console.log(res)
					this.items = res
				})
			},
			goAdd(){
				uni.navigateTo({
					url:"/pages/address/add"
				})
			},
			deleteAddress(item){
				console.log(item)
				uni.showModal({
				    title: '提示',
				    content: '确认删除该地址吗？',
				    success: (res)=> {
				        if (res.confirm) {
				            this.$get('address/addressdelete', {id:item.id}, (res) => {
				            	uni.showToast({title:"删除成功！",})
								this.getList()
				            })
				        } else if (res.cancel) {
				            console.log('用户点击取消');
				        }
				    }
				});
			},
			editAdress(item){
				uni.navigateTo({
					url:"/pages/address/add?id="+item.id
				})
			},
			chooseAddress(item){
				if(!this.isChoose){return}
				uni.setStorageSync('addressObj', item);
				uni.navigateBack({})
			},
		},
		onLoad(option) {
			if(option && option.choose){
				this.isChoose = true
			}
		},
		onShow() {
			if(!!uni.getStorageSync('token')){
				this.getList()
			}
		}
	}
</script>

<style>
	.text_green {
		color: #22BF8A;
	}

	.page {
		padding-top: 20rpx;
		padding-bottom: 120rpx;
	}

	.list {
		background-color: #FFFFFF;
		margin-bottom: 20rpx;
		padding: 30rpx;
		padding-bottom: 0;
	}

	.list .name {
		font-size: 28rpx;
		margin-bottom: 23rpx;
	}

	.list .detail_address {
		color: #AAAAAA;
		font-size: 26rpx;
		padding-bottom: 24rpx;
	}

	.list .bottom {
		border-top: 1px solid #E5E5E5;
		padding: 20rpx 0;
		font-size: 24rpx;
	}

	.list .bottom .btn_box {
		float: right;
		display: flex;
		width: 210rpx;
	}

	.list .bottom .btn_box image {
		height: 25rpx;
		margin-right: 10rpx;
		position: relative;
		top: 2rpx;
	}

	.list .bottom .btn_box view {
		flex: 1;
		margin-left: 20rpx;
	}

	uni-radio {
		position: relative;
		top: -2rpx;
	}

	.submit_btn {
		position: fixed;
		bottom: 0;
		left: 0;
		width: 100%;
		height: 96rpx;
		line-height: 96rpx;
		font-size: 30rpx;
		text-align: center;
		background-color: #22BF8A;
		color: #FFFFFF;
	}
</style>
